@import "~themes/vars";

@media(max-width: 767px) {
  .header {
    .appChildTitle {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;

      & > .attention {
        display: none;
      }
    }
  }
}

.header {
  :global .ant-menu-horizontal {
    & > .ant-menu-submenu {
      float: right;
    }
    border: none;
    display: inline-block;
  }

  box-shadow: @shadow-2;
  position: relative;
  display: flex;
  justify-content: space-between;
  height: 67px;
  background-color: #fff;
  z-index: 999;

  .leftWrapper {
    display: flex;
    padding-left: 10px;
  }

  .rightWrapper {
    display: flex;
    padding-right: 16px;
  }

  .appChildTitle {
    height: 67px;
    line-height: 67px;
    text-align: center;
    font-size: 18px;

    & > .attention {
      font-size: 12px;
      padding-left: 5px;
    }
  }


  .button {
    width: 67px;
    height: 67px;
    line-height: 67px;
    text-align: center;
    font-size: 18px;
    cursor: pointer;
    transition: @transition-ease-in;

    &:hover {
      color: @primary-color;
      background-color: fade(@primary-color, 15%);
    }
  }
}

.popovermenu {
  width: 280px;
  margin-left: 6px;

  :global .ant-popover-inner-content {
    padding: 0;

    .ant-menu-inline .ant-menu-item,
    .ant-menu-vertical .ant-menu-item {
      border-right: 0;
      height: 48px;
      line-height: 48px;
    }

    .ant-menu-inline .ant-menu-item-selected,
    .ant-menu-inline .ant-menu-selected {
      border-right: 0;
    }
  }
}
